<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>for循环的基本使用</title>
</head>
<body>
<h3> for 循环-基本使用</h3>
<h4>1. for循环语法</h4>
<pre style="font-size: 20px;">
    for (变量起始值; 终止条件; 变量变化量) {
      循环的代码语句
    }
</pre>
<hr>
<h4>2. 退出循环</h4>
<p>
continue 退出本次循环，一般用于排除或者跳过某一个选项的时候, 可以使用continue <br>
break 退出整个for循环，一般用于结果已经得到, 后续的循环不需要的时候可以使用
</p>
<p>
了解： <br>
1. while(true) 来构造“无限”循环，需要使用break退出循环。 <br>
2. for(;;) 也可以来构造“无限”循环，同样需要使用break退出循环。
</p>
<hr>

<!--演示-->
<script>
    // 1. 利用for循环输出1~100岁

    // 2. 求1-100之间所有的奇数和
    let 和 = 0
    // 终止条件,要是 真(true)
    for (let i = 1; i < 100; i++) {
        if (i % 2 !== 0) { //取余, 判断奇偶数
            和 = 和 + i
        }
    }
    console.log(和) //输出到 控制台信息

    // 3. 页面中打印5个小星星
    for (let i = 1; i <= 5; i++) {
        document.write('★') // 输出到 网页页面
    }
    document.write('<br>') //页面换行

    // 4. 循环数组 请将数组[‘马超’，‘赵云’， ‘张飞’, ‘关羽‘，’黄忠’] 依次打印出来
    let 数组=['马超', '赵云', '张飞', '关羽','黄忠' ]
    // 终止条件是 数组的长度
    for (let i = 0; i < 数组.length; i++) { // 注意细节: 数组下标是从0开始, 所有这里 变量起始值是 0
        console.log(数组[i]) // 输出数组的对应元素
    }

    // 退出循环语句
    for (let i = 1; i <= 5; i++) {
        if (i === 3) {
            continue  // 退出本次循环，本次循环中 continue下面的语句不在执行
        }
        document.write(i) // 看输出结果, 没有 3
    }
    document.write('<br>')

    for (let i = 1; i <= 5; i++) {
        if (i === 3) {
            break  // 退出整个循环 结束循环
        }
        document.write(i) // 爱看输出奇数, 只有 1 2
    }

    // 无限循环, 这种写法会无限循环 谨慎使用
    // for (; ;) {
    // }
</script>
</body>
</html>